<template>
  <div class="total">
    <!-- user menu -->
    <div class="userMenu">
      <el-row :span="24" class="projects">
        <el-col :span="24"  @click.native="getCommission()">
          <div class="projectName">历史收益<i class="icon icon1"></i></div>
          <div class="projectContent"></div>
          <div>￥{{(totalCms-0).toFixed(2)}}<i class="el-icon-arrow-right"></i></div>
        </el-col>
        <el-col :span="24" @click.native="goWithdrawals()">
          <div class="projectName">当前收益<i class="icon icon2"></i></div>
          <div class="projectContent"></div>
          <div>￥{{(curCms-0).toFixed(2)}} <span class="gocash">去提现</span> <i class="el-icon-arrow-right"></i></div>
        </el-col>
        <el-col :span="24"  @click.native="getRecord()">
          <div class="projectName">提现记录<i class="icon icon3"></i></div>
          <div class="projectContent"></div>
          <div><i class="el-icon-arrow-right"></i></div>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script type="text/ecmascript-6">
import {removeSession} from '../common/sessionStorage'
export default {
  components: {
    removeSession
  },
  created () {
    this.$http.post('http://218.104.153.143:8089/numberone-auth/busiUser/userAccountInfo.shtml', { token: this.$store.state.token }, {
      headers: {'Content-Type': 'application/x-www-form-urlencoded'},
      emulateJSON: true
    }).then((data) => {
      this.totalCms = data.body.userAccountInfo.totalCms
      this.curCms = data.body.userAccountInfo.curCms
      this.userID = data.body.userAccountInfo.userID
      console.log(data)
    }, (ne) => {
      this.$message({
        message: '网络错误',
        type: 'error',
        duration: 1000,
        showClose: false
      })
    })
  },
  data () {
    return {
      userID: '',
      totalCms: '',
      curCms: ''
    }
  },
  methods: {
    getCommission () {
      this.$router.push('/user/commission')
    },
    goWithdrawals () {
      this.$router.push('/user/withdrawals')
    },
    getRecord () {
      this.$router.push('/user/record')
    }
  }
}
</script>

<style lang="scss" type="stylesheet/scss">
  .userList{
      .inviteBtn{
      width:80%;
    }
  }

  .userMenu{
    height: 410px;
    .el-icon-arrow-right{
      color:#ccc;
      font-size:12px;
    }
    .icon{
      width:19px;
      height:18px;
      position: absolute;
      top: 16px;
      left: -21px;
    }
    .icon1{
      background: url('../../assets/imgs/icon02@2x.png') no-repeat;
      background-size:cover;
    }
    .icon2{
      background: url('../../assets/imgs/icon03@2x.png') no-repeat;
      background-size:cover;
    }
        .icon3{
      background: url('../../assets/imgs/icon04@2x.png') no-repeat;
      background-size:cover;
    }
        .icon4{
      background: url('../../assets/imgs/icon05@2x.png') no-repeat;
      background-size:cover;
    }
        .icon5{
      background: url('../../assets/imgs/icon06@2x.png') no-repeat;
      background-size:cover;
    }
    .projects{
      font-size:14px;
    padding:0 10px 0 40px;
      >.el-col-24{
         text-align: left;
         height: 50px;
         line-height: 50px;
         border-bottom: 1px solid #e3e3e3;
         display:flex;
    .projectName{
      padding-left: 5px;
      position: relative
    }
    .projectContent{
      flex:1;
    }
    .gocash{
      color:red;
      border:1px solid red;
      font-size:10px;
      border-radius:3px;
      margin-left:5px;
      padding:1px;
    }
       }
    }
  }
</style>
